<template>
    <div class="search">
        <select name="" id="">
            <option value="">阜阳</option>
        </select>
        <div class="ss">
            <img src="../../assets/imges/放大镜.jpg" alt="" class="img1">
            <input type="text" placeholder="搜索品牌、级别">
            <img src="../../assets/imges/相机.jpg" alt="" class="img2">
        </div>
        <img src="../../assets/imges/信息.jpg" alt="" class="img3">
    </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
.search {
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #F6F7FB;

    select {
        border: none;
        outline: none;
        margin-left: 20px;
    }

    .ss {
        width: 520px;
        height: 60px;
        border: 1px solid blue;
        border-radius: 10px;
        display: flex;
        justify-content: space-between;
        align-items: center;

        .img1 {
            width: 40px;
        }

        input {
            border: none;
            outline: none;
            width: 400px;
            margin-left: 30px;
            font-size: 30px;
            display: flex;
            height: 60px;
            justify-content: center;
            align-items: center;
        }

        .img2 {
            width: 50px;
        }
    }

    .img3 {
        width: 50px;
        margin-right: 25px;
    }
}
</style>